
//点击九宫格图片
$("#picList img").click(function(){
//	获取当前点击的下标
	var index = $(this).index();
	for(var i=0;i<5;i++){
//		拼接图片路径
//		img/show/0/1.jpg
		var url = "img/show/"+index+"/"+(i+1)+".jpg";
//		替换路径
//		eq选择器选取带有指定index值的元素
//		attr替换某值
		$("#showImg img").eq(i).attr("src",url);
	}
	
//	显示遮光板,fadeIn淡入
	$("#pan,#show").fadeIn(500);
});

//点击遮光板,详细图片消失
$("#pan").click(function(){
	$("#pan,#show").fadeOut(200);
})

//点击下一张
$("#next").click(function(){
//	最后一张图片
	$("#showImg img:last").animate({"left":"650px"},500,function(){
		$(this).animate({"left":"0px"},500);
//		在后面插入图片
		$("#showImg").prepend($(this));
	});
//	其余图片向左移动
	$("#showImg").animate({"left":"40%"},500);
	$("#showImg").animate({"left":"50%"},500);
});

$("#prev").click(function(){
	$("#showImg img:first").animate({"left":"-650px"},500,function(){
		$(this).animate({"left":"0px"},500);
		$("#showImg").append($(this));
	});
	$("#showImg").animate({"left":"60%"},500);
	$("#showImg").animate({"left":"50%"},500);
});